<template>
	<view class="index">
		<view class="setUp">
			<view class="setUpBox">
				<view class="setUpBoxItem" @tap="navTo('/pages/my/personalCenter')">
					<text>个人信息</text>
					<image src="@/static/img/zhankai.png" mode="widthFix"></image>
				</view>
				<view class="setUpBoxItem" @tap="navTo('/pages/shippingAddress/index')">
					<text>地址管理</text>
					<image src="@/static/img/zhankai.png" mode="widthFix"></image>
				</view>
				<view class="setUpBoxItem" @tap="navTo('/pages/my/accountSecuruty')">
					<text>账号安全</text>
					<image src="@/static/img/zhankai.png" mode="widthFix"></image>
				</view>
			</view>
		</view>
		
		<view class="setUp">
			<view class="setUpBox1">
				<view class="setUpBoxItem" @tap="navTo('/pages/my/aboutUs')">
					<text>关于宜趣多资APP</text>
					<image src="@/static/img/zhankai.png" mode="widthFix"></image>
				</view>
			</view>
		</view>
		
		<view class="setUp">
			<view class="setUpBox2">
				<view class="setUpBoxItem" @tap="navTo('/pages/my/privacyPolicy')">
					<text>隐私政策</text>
					<image src="@/static/img/yingsi.png" mode="widthFix"></image>
				</view>
			</view>
		</view>
		
		<view class="loginOut" @tap="logout('/pages/login/login')">
			退出登录
		</view>
	</view>
</template>

<script setup lang="ts">
	import {disconnectWebsocket} from '@/utils/websocket.ts'
	import {logoutIm} from '@/utils/tencent.ts'
	const navTo = (url : String) : void => {
		uni.navigateTo({ url })
	}
	
	const logout = (url : String) : void => {
		uni.clearStorage()
		disconnectWebsocket()
		logoutIm()
		uni.switchTab({
			url: `/pages/index/index`
		})
	}
</script>

<style lang="scss" scoped>
	.index {
		height: 100vh;
		background-color: #f4f6fa;
		position: relative;

		.setUp {
			padding: 24rpx;

			.setUpBox {
				background-color: #fff;
				height: 318rpx;
				border-radius: 24rpx;
				padding: 24rpx;

				.setUpBoxItem {
					height: 74rpx;
					padding: 16rpx;
					font-size: 28rpx;
					color: #262626;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 24rpx;
					// font-weight: 600;

					image {
						width: 36rpx;
					}
				}
			}
			
			.setUpBox1 {
				background-color: #fff;
				height: 118rpx;
				border-radius: 24rpx;
				padding: 24rpx;
			
				.setUpBoxItem {
					height: 74rpx;
					padding: 16rpx;
					font-size: 28rpx;
					color: #262626;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 24rpx;
					// font-weight: 600;
			
					image {
						width: 36rpx;
					}
				}
			}
			
			.setUpBox2 {
				background-color: #fff;
				height: 118rpx;
				border-radius: 24rpx;
				padding: 24rpx;
			
				.setUpBoxItem {
					height: 74rpx;
					padding: 16rpx;
					font-size: 28rpx;
					color: #262626;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 24rpx;
					// font-weight: 600;
			
					image {
						width: 36rpx;
					}
				}
			}
		}
		

		.loginOut {
			position: absolute;
			bottom: 76rpx;
			font-size: 32rpx;
			color: #FFFFFF;
			margin-left: 56rpx;
			width: 638rpx;
			height: 88rpx;
			text-align: center;
			line-height: 88rpx;
			background: #6B64D3;
			border-radius: 264rpx 264rpx 264rpx 264rpx;
		}
	}
</style>